<template>
  <div>
    <h2>当前计数：{{ $store.state.counter }}</h2>
    <button @click="increment">+1</button>
    <button @click="add">+1</button>
    <button @click="decrement">-1</button>
    <button @click="increment_n({ counter: 11 })">+10</button>
  </div>
</template>

<script>
import { mapMutations } from "vuex";
import { INCREMENT_N } from "../store/mutation-types";
export default {
  setup() {
    const storeMutations = mapMutations([
      "increment",
      "decrement",
      INCREMENT_N,
    ]);
    return {
      ...storeMutations,
    };
  },
  methods: {
    ...mapMutations(["increment", "decrement", INCREMENT_N]),
    ...mapMutations({
      add: "increment",
    }),
  },
};
</script>

<style scoped>
</style>